import React, { Component } from 'react'
import {HashRouter as Router,Route,Switch} from 'react-router-dom'
import Main from './main'
import Info from './../router3/info'
import About from './../router1/about'
import Topic from './../router1/topic'
import NoMatch from './../router3/noMatch'
import Home from './home'
export default class IRouter extends Component{
    // 不加switch会发现每一层路由都会匹配到这个nomatch组件，是因为他会从上到下挨个去匹配,只要符合要求都会加载
    // 加上switch后，只会加载到匹配到的第一个
    render(){
        return (
            <Router>
                <Home>
                    <Switch>
                        <Route path="/main" render={()=>
                            <Main>
                                <Route path="/main/:value" component={Info}></Route>
                            </Main>   
                        }></Route>
                        <Route path="/about" component={About}></Route>
                        <Route path="/topic" component={Topic}></Route>
                        <Route component={NoMatch}></Route>
                    </Switch>
                </Home>
            </Router>
        );
    }
}